import {Component, OnInit} from '@angular/core';
import {Product, ProductService} from '../share/product.service';
import {LoggerService} from '../share/logger.service';
import {FormControl} from '@angular/forms';

@Component({
  selector: 'app-product',
  templateUrl: './product.component.html',
  styleUrls: ['./product.component.css'],
  providers: [
    ProductService
  ]
})
export class ProductComponent implements OnInit {
  /**
   * 声明变量
   */
  private products: Array<Product>;

  /**
   * 商品检索
   */
  product: Product;

  /**
   * 检索的关键字
   */
  private keyword: string;
  /**
   * 响应式编程
   * @type {FormControl}
   */
  private titleFilter: FormControl = new FormControl();

  /**
   * 依赖注入
   * @param {ProductService} productService
   */
  constructor(private productService: ProductService, private logger: LoggerService) {
    this.titleFilter.valueChanges
      .subscribe(
        value => this.keyword = value
      );
  }

  ngOnInit() {
    this.products = this.productService.getAllProducts();
  }

}


